// pages/read/read.js
var app = getApp()
    // 初始化签名变量，放在 Page 前
    var content = null;
    var touchs = [];

// 在页面中定义插屏广告
let interstitialAd = null


Page({

  /**
   * 页面的初始数据
   */
  data: {

    imgList:[],
    signImage: '',

    widthV : 1,

    colorV : 1,

    result:'',

    access_token:'',
    detail:null
  },

  onDelete(){

    this.setData({
      detail :null
    })
  }
,
  onGetToken:function(){



    let authHost = "https://aip.baidubce.com/oauth/2.0/token?"
    let getAccessTokenUrl = authHost
    // 1. grant_type为固定参数
    + "grant_type=client_credentials"
    // 2. 官网获取的 API Key
    + "&client_id=RS0QzXuUTlepvGEOS3jSZOQE" 
    // 3. 官网获取的 Secret Key
    + "&client_secret=HRhTu2pB8ZKkK5vdcG3c0Got0YwkqLuc"

    let that = this
  

    wx.request({
      url: getAccessTokenUrl,
      method: 'POST',
     
      header: {
        //设置参数内容类型为x-www-form-urlencoded
        'content-type':'application/x-www-form-urlencoded',
        'Accept': 'application/json'
      },
      success: function (res) {
        console.log(res.data)
       

        that.setData({

          access_token : res.data.access_token
        })

      }
    })

   },


// 画布的触摸移动开始手势响应
start: function (event) {
  // console.log("触摸开始" + event.changedTouches[0].x);
  // console.log("触摸开始" + event.changedTouches[0].y);
  //获取触摸开始的 x,y
  let point = { x: event.changedTouches[0].x, y: event.changedTouches[0].y }
  touchs.push(point);
},
// 画布的触摸移动手势响应
move: function (e) {
  let point = { x: e.touches[0].x, y: e.touches[0].y }
  touchs.push(point);
  if (touchs.length >= 2) {
    this.draw(touchs);
  }
},
// 画布的触摸移动结束手势响应
end: function (e) {
  console.log("触摸结束" + e);
  //清空轨迹数组
  for (let i = 0; i < touchs.length; i++) {
    touchs.pop();
  }
},
// 画布的触摸取消响应
cancel: function (e) {
  console.log("触摸取消" + e);
},
// 画布的长按手势响应
tap: function (e) {
  console.log("长按手势" + e);
},
error: function (e) {
  console.log("画布触摸错误" + e);
},

  onChangeWidth(e){
    let id = e.currentTarget.dataset.width;
    content.setLineWidth(id * 3)
     this.setData({

      widthV : id
     })
  },

  onSetbackground(e){

    content.fillStyle="#FFFFFF";
    ctx.fillRect(0,0,c.width,c.height);
  },
  onChangeColor(e){
    let id = e.currentTarget.dataset.width;

  let colors = ['#000','#FFCE54','#8cc152',
  '#3bafda','#5e9cec','#D770ad','#DA4453','#ffffff']
    content.setStrokeStyle(colors[id-1])

   this.setData({

    colorV : id
   })

   if(id == 8){
    let  colorId = 5
    content.setLineWidth(colorId * 3)
     this.setData({
      widthV : colorId
     })
   }
  },

  

  /**
  * 生命周期函数--监听页面加载
  */
  onLoad: function (options) {



// 在页面onLoad回调事件中创建插屏广告实例
if (wx.createInterstitialAd) {
  interstitialAd = wx.createInterstitialAd({
    adUnitId: 'adunit-6904dcc0e2480618'
  })
  interstitialAd.onLoad(() => {})
  interstitialAd.onError((err) => {})
  interstitialAd.onClose(() => {})
}


    //获得Canvas的上下文
    content = wx.createCanvasContext('sign');
    //设置线的颜色
    content.setStrokeStyle("#000");
 	// //绘制背景色
  //  content.setFillStyle('#FAFAFA')

  //  console.log('width :' + content.width)
  //  content.fillRect(0, 0, 312, 455)


    //设置线的宽度
    content.setLineWidth(3);
    //设置线两端端点样式更加圆润
    content.setLineCap('round');
    //设置两条线连接处更加圆润
    content.setLineJoin('round');

    // this.onGetToken()
  },


  
  //绘制
  draw: function (touchs) {
    let point1 = touchs[0];
    let point2 = touchs[1];
    touchs.shift();
    content.moveTo(point1.x, point1.y);
    content.lineTo(point2.x, point2.y);
    content.stroke();
    content.draw(true);
  },
  //清除操作
  clearClick: function () {
    //清除画布
    content.clearRect(0, 0,750, 700);
    content.draw(true);
  },
  //保存图片
  saveClick: function () {
    var that = this;

    console.log('saveClick');

    wx.canvasToTempFilePath({
      canvasId: 'sign',
      success: function (res) {
        //打印图片路径
        console.log(res.tempFilePath);
        //设置保存的图片
        that.setData({
          signImage: res.tempFilePath
        })
        // that.clearClick()

        wx.saveImageToPhotosAlbum({
          filePath: that.data.signImage,
          success(res) {
            wx.showToast({
              title: '保存成功',
              icon: 'success',
              duration: 1500
            })
          
          }
        })
        // that.urlTobase64(res.tempFilePath)
      },
      error(res){

        console.log(res);
      }
    })
  },



    urlTobase64(url){

      let that = this;

      wx.request({
        url:url,
        responseType: 'arraybuffer', //最关键的参数，设置返回的数据格式为arraybuffer
        success:res=>{
          //把arraybuffer转成base64
              let base64 = wx.arrayBufferToBase64(res.data); 
              
              //不加上这串字符，在页面无法显示的哦
              // base64　= 'data:image/jpeg;base64,' + base64　
              //打印出base64字符串，可复制到网页校验一下是否是你选择的原图片呢
              console.log(base64)　
              // that.onPicToMac(base64)
            }
      })
   },



  onPicToMac(base64 ){

    let that = this;
    base64 = base64.replace('data:image/jpeg;base64,', '')
    console.log('base64 : ' + base64)

    base64 = decodeURI(base64)
    wx.request({
      url: 'https://aip.baidubce.com/rest/2.0/ocr/v1/handwriting?access_token=' + this.data.access_token,
      method: 'POST',
      data:{
        image:base64
      },    //参数为键值对字符串
      header: {
        //设置参数内容类型为x-www-form-urlencoded
        'content-type':'application/x-www-form-urlencoded',
        'Accept': 'application/json'
      },
      success: function (res) {
        console.log(res.data)
       
        that.setData({

          result : res.data.words_result[0].words
        })
      }
 
    })
  },
  
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {


    console.log('onShow')
      //  获取全局参数，在上一个页面赋值的
      var _id = app.globalData.isSaveRecord;


      if(_id){
        this.getArticleDetail(_id)
      }
  

      //  记得，一定要还原全局数据
      app.globalData.isSaveRecord = 0


      setTimeout(function() {
      
              // 在适合的场景显示插屏广告
if (interstitialAd) {
  interstitialAd.show().catch((err) => {
    console.error(err)
  })
}

     }, 2000);

  },/**
   * 获取文章详情
   */
  getArticleDetail(article_id) {
    let _this = this;

    //请求数据
    wx.request({
   
      url:'https://xhapp.lhxq.top/index.php?s=/api/article/detail&wxapp_id=10001',
   
      data:{
        article_id : article_id
      },
      success:function(result){
        
        let detail = result.data.data.detail;
        _this.setData({

          detail : detail
        })

      },
      complete:function(){
        wx.stopPullDownRefresh()
        setTimeout(function(){
         
        },1000)
      }
    })


  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },


    //转发
    onShareAppMessage: function() {
      
      return {

        title :"画一画+",
        success: function(res) {}
      }
    }
})